<template>
    <div class="addProject business-workAdd">
        <div class="addForm zll-form">
			<el-form :model="addForm" :rules="rules" ref="addForm" class="demo-ruleForm">
				<el-row :gutter="40">
					<el-col :span="8">
						<el-form-item class="formList" prop="data1" label="计划类型：">
							<el-input clearable class="input_right"  v-model="addForm.data1" :disabled="type == 'see'" ></el-input>
						</el-form-item>
						<el-form-item class="formList" prop="data2" label="计划号：">
							<el-input clearable class="input_right"  v-model="addForm.data2" disabled></el-input>
						</el-form-item>
                    </el-col>
					<el-col :span="8">
						<el-form-item class="formList" prop="data3" label="计划状态：">
							<el-input clearable class="input_right"  v-model="addForm.data3" :disabled="type == 'see'" ></el-input>
						</el-form-item>
						<el-form-item class="formList" prop="data4" label="计划日期：">
							<el-date-picker clearable class="input_right"  v-model="addForm.data4" :disabled="type == 'see'" 
                                type="date">
                            </el-date-picker>
						</el-form-item>
                    </el-col>
					<el-col :span="8">
						<el-form-item class="formList" v-if="type !== 'add'" prop="data5" label="关联订单：">
							<p>
                                {{addForm.data5}}
                                <el-tooltip placement="top" effect="light">
                                    <div slot="content">
                                        <li class="gl_list">30101002</li>
                                        <li class="gl_list">30101005</li>
                                    </div>
                                    <span @click="showList" class="right_ii el-icon-info"></span>
                                </el-tooltip>
                            </p>
						</el-form-item>
						<el-form-item class="formList" v-else></el-form-item>
						<el-form-item class="formList" prop="data6" label="完成日期：">
							<el-date-picker clearable class="input_right"  v-model="addForm.data6" :disabled="type == 'see'" 
                                type="date">
                            </el-date-picker>
						</el-form-item>
                    </el-col>
                </el-row>
                <div class="tableList">
                    <table border="1">
                        <tr>														
                            <th>品类</th>
                            <th>任务名称</th>
                            <th width="250">规格</th>
                            <th>单件万支</th>
                            <th>件数</th>
                            <th>任务量(万支)</th>
                            <th>已完成(万支)</th>
                            <th>完成率</th>
                        </tr>
                        <tr class="add_Table" >
                            <td><el-input v-model="addForm.data7" placeholder="" class="text_center" clearable :disabled="type == 'see'"></el-input></td>
                            <td><el-input v-model="addForm.data8" placeholder="" class="text_center" clearable :disabled="type == 'see'"></el-input></td>
                            <td><el-input v-model="addForm.data9" placeholder="" class="text_center" clearable :disabled="type == 'see'"></el-input></td>
                            <td><el-input v-model="addForm.data10" placeholder="" class="text_center" clearable  :disabled="type == 'see'"></el-input></td>
                            <td><el-input v-model="addForm.data11" placeholder="" class="text_center" clearable  :disabled="type == 'see'"></el-input></td>
                            <td><p>{{ addForm.data12 }}</p></td>
                            <td><el-input v-model="addForm.data13" placeholder="" class="text_center" clearable  :disabled="type == 'see'"></el-input></td>
                            <td><el-input v-model="addForm.data14" placeholder="" class="text_center" clearable  :disabled="type == 'see'"></el-input></td>
                        </tr>
                    </table>
                </div>
                <div class="nav_list" v-if="type!=='add'">
                    <div class="_title"><i class="el-icon-s-promotion"></i>生产记录</div>
                    <div class="tableList" style="margin-top: 0;">
                        <table border="1">
                            <tr>																					
                                <th>生产日期</th>
                                <th>班次</th>
                                <th>件数</th>
                                <th>数量（万支）</th>
                                <th>确认人</th>
                            </tr>
                            <tr v-if="addForm.tableData.length == 0" class="noData"><td colspan="5">暂无数据</td></tr>
                            <tr v-else class="add_Table" v-for="(item, index) in addForm.tableData"  :key="index">
                                <td><p>{{ item.data1 }}</p></td>
                                <td><p>{{ item.data2 }}</p></td>
                                <td><p>{{ item.data3 }}</p></td>
                                <td><p>{{ item.data4 }}</p></td>
                                <td><p>{{ item.data5 }}</p></td>
                            </tr>
                        </table>
                    </div>
                </div>
            </el-form>
        </div>
    </div>
</template>
<script>
export default {
    props: ['type'],
    data(){
        return {
            addForm: {
                data1:'',
                data2:'',
                data3:'',
                data4:'',
                data5: 2,
                data6:'',
                tableData: []
            },
            rules: {
                data4: [
                    {required: true, message: '请选择计划日期', trigger: 'change'},
                ],
                data6: [
                    {required: true, message: '请选择完成日期', trigger: 'change'},
                ],
            },
        }
    },
    methods: {
        showList() {

        },
		submitForm(val) {
			let self = this;
            self.$refs['addForm'].validate((valid) => {
                if (valid) {
                    self.$eventBus.$emit("updateWorkList");
                } else {
                    return false;
                }
            });
		},
    },
    mounted(){
        
    },
    components: {
    }
}
</script>
<style lang="scss" scoped>
    @import "@/style/dialog.scss";
    .business-workAdd.addProject {
        .nav_list {
            margin-top: 20px;
            ._title {
                line-height: 40px;
                color: #00D1D0;
                i {
                    font-size: 16px;
                    margin-right: 5px;
                }
            }
        }
        .right_ii {
            margin-left: 10px;
            color: #2196f3;
            font-size: 16px;
            cursor: pointer;
        }
        .formList {
            margin-bottom: 0px;
            height: 32px;
        }
        .tableList {
            margin-bottom: 20px;
            table {
                tr {
                    background: #fff !important;
                    td {
                        padding: 1px 3px;
                    }
                }
            }
        }
    }
</style>